<!-- 这里面主要放search下的根据类型返回的组件 -->
<template>
    <el-form-item :label="props.data.label" :prop="props.data.prop">
        <el-input v-if="props.data.type == 'input'" v-model="value" :placeholder="'请输入' + props.data.label" clearable
            @keyup.enter="props.handleQuery" />
        <el-tree-select v-else-if="props.data.type == 'treeSelect'" v-model="value" :placeholder="'请选择' + props.data.label"
            clearable :data="selects" :expand-on-click-node="false" :render-after-expand="false" @change="props.handleQuery"
            check-strictly :props="{ label: 'label' }" node-key="id" filterable />
        <el-date-picker v-else-if="props.data.type == 'dateTime'" v-model="value" value-format="YYYY-MM-DD HH:mm:ss"
            type="datetimerange" :default-time="[new Date(2000, 1, 1, 0, 0, 0),
            new Date(2000, 2, 1, 23, 59, 59),]" range-separator="-" start-placeholder="开始时间"
            end-placeholder="结束时间"></el-date-picker>
        <el-date-picker v-else-if="props.data.type == 'date'" v-model="value" value-format="YYYY-MM-DD HH:mm:ss"
            :default-time="[new Date(2000, 1, 1, 0, 0, 0),
            new Date(2000, 2, 1, 23, 59, 59),]" type="daterange" range-separator="-" start-placeholder="开始日期"
            end-placeholder="结束日期"></el-date-picker>
        <el-select v-else-if="props.data.type == 'select'" v-model="value" clearable filterable
            :placeholder="'请输入' + props.data.label" @change="props.handleQuery">
            <el-option v-for="item in selects" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
        </el-select>
    </el-form-item>
</template>
<script setup lang="ts">
import { searchComponentType } from "@/components/tableRelate/searchTypeTs"
import { PropType } from 'vue';
const value = defineModel();
const props = defineProps({
    handleQuery: { type: Function, default: () => { } },
    selects: { type: Array as PropType<{ label: string, value: string | number }[]> },
    data: {
        type: Object as PropType<{
            type: searchComponentType,
            label: string,
            prop: string,
        }>,
        required: true,
    }
})
</script>